<template>
  <div class="jsbsf">
    <p class="top">
      <span style="font-weight: 700; font-size: 16px; color: #000">患者1</span>
      <span style="display: inline-block; margin: 0 20px"
        >证件号：533221194503112723</span
      >
      <span>填表人：肖汉琪</span>
    </p>
    <div class="box">
      <span>随访时间：</span>
      <el-date-picker
        v-model="value2"
        align="right"
        type="date"
        placeholder="选择随访时间"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>治疗月序：</span>
      第
      <el-input
        placeholder="请输入"
        v-model="info.治疗月序"
        style="width: 200px"
        size="small"
      >
        <template slot="append">月</template>
      </el-input>
    </div>
    <div class="box">
      <span>督导人员：</span>
      <el-radio-group v-model="info.督导人员">
        <el-radio label="医生">医生</el-radio>
        <el-radio label="家属">家属</el-radio>
        <el-radio label="自服药">自服药</el-radio>
        <el-radio label="其他">其他</el-radio>
        <el-input
          placeholder="请输入"
          v-model="info.督导人员其他"
          style="width: 200px"
          size="small"
        >
          <!-- <template slot="append">月</template> -->
        </el-input>
      </el-radio-group>
    </div>
    <div class="box">
      <span>随访方式：</span>
      <el-radio-group v-model="info.随访方式">
        <el-radio label="门诊">门诊</el-radio>
        <el-radio label="家庭">家庭</el-radio>
        <el-radio label="电话">电话</el-radio>
      </el-radio-group>
    </div>
    <div class="box">
      <span>症状及体征：</span>
      <el-checkbox-group v-model="info.症状及体征">
        <el-checkbox label="没有症状" value="没有症状"></el-checkbox>
        <el-checkbox label="咳嗽咳痰" value="咳嗽咳痰"></el-checkbox>
        <el-checkbox label="低热盗汗" value="低热盗汗"></el-checkbox>
        <el-checkbox label="咯血或血痰" value="咯血或血痰"></el-checkbox>
        <el-checkbox label="胸痛消瘦" value="胸痛消瘦"></el-checkbox>
        <el-checkbox label="恶心纳差" value="恶心纳差"></el-checkbox>
        <el-checkbox label="关节疼痛" value="关节疼痛"></el-checkbox>
        <el-checkbox label="头痛失眠" value="头痛失眠"></el-checkbox>
        <el-checkbox label="视物模糊" value="视物模糊"></el-checkbox>
        <el-checkbox
          label="皮肤瘙痒、皮疹"
          value="皮肤瘙痒、皮疹"
        ></el-checkbox>
        <el-checkbox
          label="耳鸣、听力下降"
          value="耳鸣、听力下降"
        ></el-checkbox>
        <el-checkbox label="其他" value="其他"></el-checkbox>
      </el-checkbox-group>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">生活方式评估</p>
    <div class="box">
      <span>吸烟：</span>
      <el-input
        placeholder="请输入"
        v-model="info.吸烟"
        style="width: 300px"
        size="small"
      >
        <template slot="prepend">本次</template>
        <template slot="append">支/天</template>
      </el-input>
      <el-input
        placeholder="请输入"
        v-model="info.吸烟"
        style="width: 300px"
        size="small"
      >
        <template slot="prepend">目标</template>
        <template slot="append">支/天</template>
      </el-input>
    </div>
    <div class="box">
      <span>饮酒：</span>
      <el-input
        placeholder="请输入"
        v-model="info.饮酒"
        style="width: 300px"
        size="small"
      >
        <template slot="prepend">本次</template>
        <template slot="append">两/天</template>
      </el-input>
      <el-input
        placeholder="请输入"
        v-model="info.饮酒"
        style="width: 300px"
        size="small"
      >
        <template slot="prepend">目标</template>
        <template slot="append">两/天</template>
      </el-input>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">用药</p>
    <div class="box">
      <span>化疗方案：</span>
      <el-input
        placeholder="请输入"
        v-model="info.化疗方案"
        style="width: 200px"
        size="small"
      >
        <!-- <template slot="prepend">本次</template> -->
        <!-- <template slot="append">两/天</template> -->
      </el-input>
    </div>
    <div class="box">
      <span>用法：</span>
      <el-radio-group v-model="info.用法">
        <el-radio label="每日">每日</el-radio>
        <el-radio label="间歇">间歇</el-radio>
      </el-radio-group>
    </div>
    <div class="box">
      <span>药品剂型：</span>
      <el-checkbox-group v-model="info.药品剂型">
        <el-checkbox
          label="固定剂量复合制剂"
          value="固定剂量复合制剂"
        ></el-checkbox>
        <el-checkbox label="散装药" value="散装药"></el-checkbox>
        <el-checkbox label="板式组合药" value="板式组合药"></el-checkbox>
        <el-checkbox label="注射剂" value="注射剂"></el-checkbox>
      </el-checkbox-group>
    </div>
    <div class="box">
      <span>漏服药次数：</span>
      <el-input
        placeholder="请输入"
        v-model="info.漏服药次数"
        style="width: 200px"
        size="small"
      >
        <!-- <template slot="prepend">本次</template> -->
        <template slot="append">次</template>
      </el-input>
    </div>
    <div class="box">
      <span>药物不良反应：</span>
      <el-radio-group v-model="info.药物不良反应">
        <el-radio label="无">无</el-radio>
        <el-radio label="有">有</el-radio>
        <el-input
          placeholder="请输入"
          v-model="info.药物不良反应有"
          style="width: 200px"
          size="small"
        >
          <!-- <template slot="prepend">本次</template> -->
          <!-- <template slot="append">次</template> -->
        </el-input>
      </el-radio-group>
    </div>
    <div class="box">
      <span>并发症或合并症：</span>
      <el-radio-group v-model="info.并发症或合并症">
        <el-radio label="无">无</el-radio>
        <el-radio label="有">有</el-radio>
        <el-input
          placeholder="请输入"
          v-model="info.并发症或合并症有"
          style="width: 200px"
          size="small"
        >
          <!-- <template slot="prepend">本次</template> -->
          <!-- <template slot="append">次</template> -->
        </el-input>
      </el-radio-group>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">转诊</p>
    <div class="box">
      <span>转诊：</span>
      <el-radio-group v-model="info.转诊">
        <el-radio label="无">无</el-radio>
        <el-radio label="有">有</el-radio>
      </el-radio-group>
      <div v-if="info.转诊 == '有'">
        <p style="margin: 5px 0">
          科别：
          <el-input
            placeholder="请输入"
            v-model="info.科别"
            style="width: 200px"
            size="small"
          >
          </el-input>
        </p>
        <p style="margin: 5px 0">
          原因：
          <el-input
            placeholder="请输入"
            v-model="info.原因"
            style="width: 200px"
            size="small"
          >
          </el-input>
        </p>
        <p style="margin: 5px 0">
          两周内随访，随访结果：
          <el-input
            placeholder="请输入"
            v-model="info.两周内随访随访结果"
            style="width: 200px"
            size="small"
          >
          </el-input>
        </p>
        <p style="margin: 5px 0">
          若因药物不良反应停药， 请选择停药日期：
          <el-date-picker
            v-model="value2"
            align="right"
            type="date"
            placeholder="选择时间"
            :picker-options="pickerOptions"
            size="small"
          >
          </el-date-picker>
        </p>
        <p style="margin: 5px 0">
            重新开始服药日期：
          <el-date-picker
            v-model="value2"
            align="right"
            type="date"
            placeholder="选择时间"
            :picker-options="pickerOptions"
            size="small"
          >
          </el-date-picker>
        </p>
      </div>
    </div>
    <div class="box">
      <span>处理意见：</span>
      <el-input
          placeholder="请输入"
          v-model="info.处理意见"
          style="width: 200px"
          size="small"
        >
          <!-- <template slot="prepend">本次</template> -->
          <!-- <template slot="append">次</template> -->
        </el-input>
    </div>
    <div class="box">
      <span>下次随访日期：</span>
      <el-date-picker
        v-model="value2"
        align="right"
        type="date"
        placeholder="选择下次随访日期"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>评估医生签名：</span>
      <el-select
        filterable
        placeholder="请选择"
        size="small"
        style="width: 200px"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-select
        filterable
        placeholder="请选择"
        size="small"
        style="width: 200px; margin-left: 20px"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
    </div>
    <div class="box">
      <span>随访照片：</span>
      <el-button
        icon="el-icon-upload2"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >本地上传文件</el-button
      >
      <el-button
        icon="el-icon-picture-outline"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >加载手机图片</el-button
      >
      <p style="margin-top: 10px">
        扫描二维码，在手机端点击"上传"图片，在手机端上传后，点击上方"加载手机照片"按钮，即可同步到电脑端
      </p>
      <div>
        <img
          style="width: 100px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
        <img
          style="width: 100px; margin-left: 20px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
      </div>
    </div>
  </div>
</template>
          
          <script>
export default {
  data() {
    return {
      info: {
        症状及体征: [],
        药品剂型: [],
      },
      options: [
        {
          value: "测试",
          label: "测试",
        },
      ],
      pickerOptions: {
        
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
        ],
      },
      value2: "",
    };
  },
  methods: {
    btn_ok() {
      var url = this.info.id
        ? "/diabetesServiceVisit/modify"
        : "/diabetesServiceVisit/add";
      this.info.symptom = this.info.symptom.toString();
      this.info.signFootArterial = this.info.signFootArterial.toString();
      this.info.insulinCount = this.info.insulinCount.toString();
      var date = new Date();
      this.info.id
        ? (this.info.updatetime = date)
        : (this.info.createtime = date);
      this.$post(url, this.info).then((res) => {
        if (res.code == 400) {
          this.$message({
            message: res.message,
            type: "error",
          });
          return;
        }
        this.$message({
          message: "操作成功",
          type: "success",
        });
      });
    },
    getInfo(item) {
      this.isLoading = true;
      this.info = item;
      this.isLoading = false;
    },
    clear_info() {
      this.info = {
        hospitalId: "3015",
        idNo: localStorage.getItem('idCard'),
        residentName: "测试患者",
        symptom: [],
        signFootArterial: [],
        diabetesServiceChildList: [{}],
        insulinCount: [],
      };
    },
  },
};
</script>
          
          <style scoped lang="scss">
.jsbsf {
  .top {
    padding: 10px 20px;
    background-color: #e6f7ff;
    border: 1px solid #91d5ff;
  }
  .tab1 {
    tr {
      width: 100%;
      th {
        text-align: center;
        color: #000;
        background-color: rgb(250, 250, 250);
      }
      td {
        padding: 10px;
      }
    }
  }
  .box {
    padding: 10px 250px;
    background-color: rgb(250, 250, 250);
    margin: 10px 0;
  }
}
.table_rd_pd {
  th,
  td {
    padding: 5px 10px;
  }
}
</style>